<template>
  count ： {{ count }}
  <br />
  deubleCount: {{ deubleCount }}
  <br />
  <button @click="btnClick">+</button>
  <button @click="changeTitle">改变title</button>
</template>

<script>
import { computed, ref, onMounted } from 'vue'
import useCount from './useCount'
import useTitle from './useTitle'
export default {
  setup() {
    // 调用hooks
    const { count, deubleCount, btnClick } = useCount()
    // 调用hooks
    const titleRef = useTitle('哈')
    const changeTitle = () => {
      console.log('我被点击了', titleRef.value)
      titleRef.value = titleRef.value + '嘿'
    }
    return {
      count,
      deubleCount,
      btnClick,
      changeTitle,
    }
  },
}
</script>
<style scoped></style>
